استفاده از bootstrap در طراحی وب سایت

زمانی که اولین وب سایت در دنیا طراحی شد تنها از html   برای طراحی آن استفاده شد و پس از با آمدن زبان های برنامه نویسی دیگر طراحی سایت گسترش زیادی پیدا کرد و وب سایت های زیادی طراحی شد به دنبال آن وسایل دیجیتالی مختلفی با اندازه های متفاوتی به بازار عرضه شد .

کاربران اینترنت اکنون با دستگاه های مختلفی وب سایت ها را بازدید می کنند اکنون چالش طراحان وب سایت این است که با چه روشی می توان یک طراحی وب سایت داشته باشند .

به عبارت دیگر چگونه می توان یک وب سایت را طراحی کرد که با دستگاه های مختلفی با اندازه های متفاوتی ، کاربران بتوانند به راحتی سایت را بازدید کنند و ظاهر زیبای وب سایت در اندازه های متفاوت به هم نریزد .

در این مقاله به بررسی این چالش و معرفی bootstrap به عنوان یکی از راه حل های آن می پردازیم .

استفاده از  css media query

یکی از اولین راه حل ها برای ریسپانسیو کردن وب سایت استفاده از css است . این روش خیلی دقیق است و می توان بر روی تمام پیکسل های صفحه کنترل داشت .

روال کار این روش به این صورت است که تعیین می کنیم در فلان سایز مورد نظر فلان عنصر html این استایل ها را داشته باشد .

خوبی این روش برای طراحی سایت این است که می توان به تمامی پیکسل های صفحه دسترسی داشته باشیم و عیب این روش این است که تعداد کد های زیادی را باید برای تمام عناصر داخل صفحه بنویسیم و این کار نیازمند حوصله و پشتکار خاصی است .

ریسپانسیو کردن وب سایت با bootstrap

یکی از محبوب ترین و قدرتمند ترین روش ها برای ریسپانسیو کردن طراحی سایت استفاده از فریم ورک bootstrap است . بوت استرپ فریم ورکی قوی برای html , css , javascript است .

این فرم ورک دارای ماژول های بسیار زیبا و قوی است . یکی از مهم ترین امکانات این فرم ورک قابلیت ریسپانسیو کردن وب سایت را دارد .

روال کار این فرم ورک برای ریسپانسیو کردن به این صورت است که در حال کلی دو روش برای طراحی یک وب سایت دارد . فول اسکرین یا باکسی . روش فول اسکرین تمام عرض صفحه را یه خود اختصاص می دهد و روش باکسی از کناره های وب سایت 103 پیکسل فاصله می گیرد .

بوت استرپ کل صفحه رو به 12 ستون تقسیم می کند که طراحی می تواند تعیین کند که یک عنصر از چند تا از این ستون ها استفاده کند . همچنین بوت استرپ دارای 4 سایز مختلف است lg , md , sm , xs   طراح به راحتی می تواند تعیین کند که در فلان سایز این عصر چه تعداد از این ستون را به خود اختصاص دهد .

نتیجه گیری

یکی از مهم ترین چالش های طراحان وب سایت طراحی وب سایت ریسپانسیو است . برای طراحی سایت ریسپاسیو روش های مختلفی است . یکی از محبوب ترین و قدرتمندترین ابزار ها برای این کار استفاده از فرم ورک بوت استرپ است .